@extends('layout.master')

@section('title')
   Product Page
@stop

@section('username')
   {{ Auth::user()->userName }} 
@stop

@section('header')
    @parent
@stop

@section('side-menu')
    @parent
@stop

@section('content')
    <h3> Low Stock  </h3> <hr />

    <div class="content-container">                
            <div id="chart1" style=" width:900px; height:500px;"></div>                
    </div>               
@stop

@section('scripts')

     <script type="text/javascript" src="{{ URL::asset('js/jqplot/jquery.jqplot.min.js') }}"> </script>     
            <script type="text/javascript" src="{{ URL::asset('js/jqplot/shCore.min.js') }}"></script>
            <script type="text/javascript" src="{{ URL::asset('js/jqplot/shBrushJScript.min.js') }}" />"></script>
            <script type="text/javascript" src="{{ URL::asset('js/jqplot/shBrushXml.min.js') }}" />"></script>
            <script type="text/javascript" src="{{ URL::asset('js/jqplot/jqplot.barRenderer.min.js') }}" />"></script>
            <script type="text/javascript" src="{{ URL::asset('js/jqplot/jqplot.categoryAxisRenderer.min.js') }}" />"></script>
            <script type="text/javascript" src="{{ URL::asset('js/jqplot/jqplot.pointLabels.min.js') }}" />"></script>
    <script type="text/javascript">


        $(function(){          
                              
             var quantity = [1, 2];
             var name = ["A", "B"];

             

             $.ajax({

                url: '/Admin/Stats/Stock',
                type: 'GET',
                success: function(data) {

                   $.each(data, function(i) {

                        quantity[i] = data[i].quantity;
                        name[i] = data[i].productName;
                   });

                 plot1 = $.jqplot('chart1', [quantity], {
                // Only animate if we're not using excanvas (not in IE 7 or IE 8)..
                title: 'Items With Low Stock',
                animate: !$.jqplot.use_excanvas,
                seriesDefaults:{
                    renderer:$.jqplot.BarRenderer,
                    pointLabels: { show: false }
                },
                axes: {
                    xaxis: {
                        renderer: $.jqplot.CategoryAxisRenderer,
                        ticks: name,
                        label: 'Items'
                    },
                    yaxis: {
                        label: 'Quantity'
                    }
                },
                highlighter: { show: false }
            });
     
            $('#chart1').bind('jqplotDataClick',
                        function(ev, seriesIndex, pointIndex, data) {
                            $('#info1').html('series: ' + seriesIndex + ', point: ' + pointIndex + ', data: ' + data);
                        }
            );
                },
                error: function() {

                    alert("Something went wrong");
                }
             });
        });

           
            /* $.jqplot.config.enablePlugins = true;
            var s1 = [4, 2, 0, 9, 4, 3];
            var ticks = ['FIFA 14', 'GTA 5', 'Battlefield 3', 'NFS', 'Max Payne 3'];
         
            plot1 = $.jqplot('chart1', [s1], {
                // Only animate if we're not using excanvas (not in IE 7 or IE 8)..
                title: 'Items With Low Stock',
                animate: !$.jqplot.use_excanvas,
                seriesDefaults:{
                    renderer:$.jqplot.BarRenderer,
                    pointLabels: { show: true }
                },
                axes: {
                    xaxis: {
                        renderer: $.jqplot.CategoryAxisRenderer,
                        ticks: ticks,
                        label: 'Items'
                    },
                    yaxis: {
                        label: ''
                    }
                },
                highlighter: { show: false }
            });
     
            $('#chart1').bind('jqplotDataClick',
                        function(ev, seriesIndex, pointIndex, data) {
                            $('#info1').html('series: ' + seriesIndex + ', point: ' + pointIndex + ', data: ' + data);
                        }
                );
            }); */
    </script>  
@stop
